const id = localStorage.getItem('ider')
let layer = layui.layer
// $('#cname').text(localStorage.getItem('catename'))
// 渲染数据
renderShow()
function renderShow() {
  axios.get('/index/show', { params: { id: id } }).then(({ data: { data: { info, next, prev, recommend } } }) => {
    const time = info.create_date
    const date = new Date(time)
    let newTime = date.getFullYear() + '-' + date.getMonth() + '-' + date.getDay()
 
    const { title, author, click, content, lovenum, tags, isCollect, isLike } = info


    const header = `<header class="article-header">
      <!-- 面包屑 -->
      <div class="breadcrumbs">
        <span class="text-muted">当前位置：</span>
        <a href="">优点达资讯</a>
        <small>></small>
        <a href="./list.html">${localStorage.getItem('catename')}</a> <small>></small>
        <span class="text-muted">正文</span>
      </div>
      <!-- 标题 -->
      <h1 class="article-title"><a href="">${title}</a></h1>
      <!-- 标题描述 -->
      <ul class="article-meta">
        <li><a href="">${author}</a> 发布于 ${newTime}</li>
        <li>分类：<a href="" rel="category tag">${localStorage.getItem('catename')}</a></li>
        <li><span class="post-views">阅读(${click})</span></li>
        <li>评论(1)</li>
        <li><a href="javascript:;" id="collect" class=${isCollect ? 'collect' : ''}>${isCollect ? "已收藏" : '点击收藏'}</a></li>
      </ul>
    </header>`
    const article = `<article class="article-content">
    <!-- 文章内容开始 -->
    <p>${content}</p>
    <!-- 文章内容结束 -->

    <!-- 版权描述 -->
    <p class="post-copyright">未经允许不得转载：
      <a href="">优点达资讯</a> &raquo; <a href="">${title}</a>
    </p>
  </article>
  `
  // <!-- 点赞 -->
  const zan = `<a href="javascript:;" class="action ${isLike ? 'action-like' : 'nolike'}" id="dianzan">
      <i class="glyphicon glyphicon-thumbs-up"></i>${isLike ? "已赞" : '点赞'} (<span>${lovenum ? isLike ? +lovenum : lovenum >= 1 ? lovenum - 1 : lovenum : ''}</span>)
    </a>`
    // if(lovenum){
    //   // 如果是已赞
    //   if(isLike){
    //     // 数字不变
    //     lovenum = lovenum
    //   }else {
    //     // 否则减一
    //     lovenum = lovenum - 1
    //   }
    // } else {
    //   lovenum = ''
    // }
    // <!-- 上下一篇 -->
    const pian = `
    <span class="article-nav-prev">
      <span>上一篇</span>
      <a href="show.html?${prev[0].id}" rel="prev">${prev[0].title}</a>
    </span>
    <span class="article-nav-next">
      <span>下一篇</span>
      <a href="show.html?${next[0].id}" rel="next">${next[0].title}</a>
    </span>
    `

  $('.article-header').html(header)
  $('.article-content').html(article)
  $('.article-social').html(zan)
  $('.article-nav').html(pian)
    // 相关推荐部分
    const rec = recommend.map(({ cateid, id, pic, title }) => {
      return `<li>
    <a target="_blank" href="" data-id="${cateid}" id="${id}">
      <span>
        <img src="http://124.223.14.236:8060/${pic}" class="thumb" />
      </span>
      ${title}
    </a>
  </li>`
    })
    $('.relates ul').html(rec)

  })
}
// =========收藏============================
$('body').on('click', '#collect', function () {
  let query = {
    action: $(this).hasClass('collect') ? 'del' : 'add',  
  }
  axios.get('/user/userDataHandle',{
    params: {
      action: query.action,
      article_id: id,
      type: 1,
      token: localStorage.getItem('token')
    }
  }).then(({errno,errmsg}) => {
    if (errno) return layer.msg(errmsg)
    renderShow()
  })

});

// ===========点赞=======================
$('body').on('click', '#dianzan', function () {
  let query = {
    action: $(this).hasClass('action-like') ? 'del' : 'add',  
  }
  axios.get('/user/userDataHandle',
    {
      params: {
        action: query.action,
        article_id: id,
        type: 2,
        token: localStorage.getItem('token')
      }
    }).then(({errno,errmsg}) => {
      // console.log(res)
      if (errno) return layer.msg(errmsg)
      renderShow()
    })
})
